<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>show all students</title>
{#    使用jquery  #}
    <script type="text/javascript" src="/static/js/jquery-3.1.1.min.js"></script>
</head>

<body>
            <button id="btn">
                show database of students
            </button>
            <ul id="stus">

            </ul>

            <script type="text/javascript">
                $(document).ready(function () {
                    $("#btn").bind("click", function () {
                        {# 发起一个ajax请求  #}
                        /*
                        $.get("/ajax_allStudents/", function (data, status) {
                            console.log("111111");
                            console.log(data,status);
                            stus = data["data"];
                            for (var i = 0; i<stus.length; i++){
                                stu = stus[i];
                                $li = $("<li>"+stu.name+"*"+stu.age+"</li>")
                                $("#stus").append($li)
                            }
                        });
                        console.log("2222222")
                    })
                })
                */

                        {#  另一种方法   #}
                        $.ajax({
                            url: "/ajax_allStudents/",
                            type: "get",
                            data: {"a": 1, "b": 2},
                            dataType: "json",
                            success: function (data, status) {
                                console.log("111----111");
                                console.log(data,status);
                                stus = data["data"];
                                for (var i=0; i<stus.length; i++){
                                stu = stus[i];
                                $li = $("<li>"+stu.name + "*" + stu.age + "</li>");
                                $("#stus").append($li);
                                }
                            }
                            });
                        console.log("222----2222")
                        })
                    })

                
            </script>


</body>
</html>